<template>
    <rx-dialog @ok="submitForm" @cancel="cancel" :btnAlign="'center'">
        <rx-fit>
            <template #middle>
                <div style="width:100%;padding:20px;">
                    <a-form ref="form" :model="form" :rules="rules" layout="vertical">
                        <a-row>
                            <a-col :span="24">
                                <span class="bpm-task-title">
                                {{ subject }}
                                </span>
                            </a-col>
                        </a-row>
                        <a-form-item :label="i18n('taskComm.communicator','沟通人')">
                            <rx-user-component ref="toUser" v-model="form.toUser" :single="false"></rx-user-component>
                        </a-form-item>
                        <a-form-item :label="i18n('taskCheck.opinion','意见')">
                            <a-textarea v-model:value="form.opinion" style="width: 100%"/>
                        </a-form-item>
                        <a-form-item :label="i18n('taskCheck.attachment','附件')">
                            <rx-attach-component v-model="fileList" class="uploader-btn-ctl"></rx-attach-component>
                        </a-form-item>
                    </a-form>
                </div>
            </template>
        </rx-fit>
    </rx-dialog>
</template>

<script>
import {BaseFormModel, RxDialog, Util} from '@lowcode/jpaas-base-lib';
import {RxAttachComponent, RxUserComponent} from '@lowcode/jpaas-share-component';
import BpmtaskApi from "@/common/api/bpm/bpmTask";

export default {
    name: "bpm-task-linkup",
    props: {
        subject: String,
        taskId: String,
        layerid: String,
        destroy: Function
    },
    mixins: [BaseFormModel],
    components: {
        RxAttachComponent,
        RxUserComponent,
        RxDialog
    },
    data() {
        return {
            rules: {
                toUser: [{
                    required: true,
                    message: this.i18n('taskComm.communicator', '请选择沟通人', 'select'),
                    trigger: 'change'
                }]
            },
            form: {
                opinion: "",
                opFiles: "",
                toUser: [],
                informTypes: []
            },
            fileList: []
        }
    },
    created() {
        this.init();
    },
    methods: {
        i18n(name, text, key) {
            return this.$ti18(name, text, "bpmTask", key);
        },
        init() {
            this.form.taskId = this.taskId;
        },
        closeWindow() {
            Util.closeWindow(this, 'cancel');
        },
        submitForm(e) {
            var self_ = this;
            var userIds = this.$refs.toUser.getUserIds();
            if (!userIds) {
                e.loading = false;
                this.$message.error(this.i18n('taskComm.submitTips', '请选择沟通人！'));
                return;
            }
            this.form.opFiles = JSON.stringify(this.fileList);
            this.$refs.form.validate().then(() => {
                self_.form.msgTypes = self_.form.informTypes.join(",");
                self_.form.toUserAccounts = userIds;
                self_.$confirm({
                    zIndex: 20000,
                    title: self_.$ti18('rxMsa.tipsInfo', '提示信息'),
                    content: self_.i18n('taskComm.sendCommTips', '确认发送沟通任务吗?'),
                    okText: self_.$ti18('rxForm.ackBtn', '确认'),
                    cancelText: self_.$ti18('rxForm.cancelBtn', '取消'),
                    onOk() {
                        delete self_.form.informTypes;
                        delete self_.form.toUser;
                        BpmtaskApi.submitTasklinkup(self_.form).then(resp => {
                            e.loading = false;
                            if (resp.success) {
                                Util.closeWindow(self_, "ok");
                            }
                        });
                    },
                    onCancel() {
                        e.loading = false;
                    }
                });
            }).catch((error) => {
                e.loading = false;
            })
        }
    }
}
</script>

<style scoped>
.uploader-btn-ctl ::v-deep(.uploader-btn){
    padding: 5px 6px;
}
.bpm-task-title{
    font-size: 16px;
    color: rgb(77, 158, 255);
    display: inline-block;
    padding-bottom: 16px;
}
</style>
